<template>
	<div v-loading="loading">
		<el-tabs v-model="activeName" class="demo-tabs">
			<el-tab-pane label="申请表" :name="0"></el-tab-pane>
			<el-tab-pane label="申报材料" :name="1"></el-tab-pane>
		</el-tabs>
		<div class="left_right">
			<div class="left_part" v-if="activeName == 0">
				<!-- 申报表 -->
				<!-- 家庭养老床位运营补贴 -->
				<ApplyTable v-if="nowRowData.dataType==1" :editData="tableData" :isDetail="true"></ApplyTable>
				<!-- 新增床位补贴 -->
				<AddBedTable v-if="nowRowData.dataType==2" :editData="tableData" :isDetail="true"></AddBedTable>
			</div>
			<!-- 申报材料 -->
			<div class="left_part" v-if="activeName == 1">
				<ApplyMaterial :nowRowData="nowRowData"></ApplyMaterial>
			</div>
			<!-- 审批流程 -->
			<div class="right_part">
				<el-timeline>
					
					<el-timeline-item  type="primary" hide-timestamp v-for="(item,index) in processList" :key="index">
                        <div class="aduit_btn_part">
                            <h4>{{ item.approvalRemarks }}</h4>
                        </div>
						<p>{{ item.createTime }}</p>
					</el-timeline-item>
					<el-timeline-item type="primary" hide-timestamp v-if="(processList[processList.length-1].approvalRemarks=='申请提交')">
						<div class="aduit_btn_part">
                            <h4>初审</h4>
						    <el-button v-auth="'apply_btn'" style="margin-left: 20px;" type="primary" @click="openDialog(1)">通过</el-button>
                        </div>
					</el-timeline-item>
					<el-timeline-item  type="primary" hide-timestamp v-if="(processList[processList.length-1].approvalRemarks=='初审通过')">
						<div class="aduit_btn_part">
                            <h4>复审</h4>
						    <el-button v-auth="'apply_btn'" style="margin-left: 20px;" type="primary" @click="openDialog(2)">通过</el-button>
                        </div>
					</el-timeline-item>
				</el-timeline>
				
			</div>
		</div>
	</div>
</template>

<script setup lang="ts">
import { ref, reactive, toRefs, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import apiMod from '@/apiMod/index'
// 床位运营补贴
import ApplyTable from '../table/ApplyTable.vue'
// 床位建设补贴
import AddBedTable from '../table/addBedTable.vue'
import ApplyMaterial from '@/views/instOperate/NingQiTongAudit/aduit/components/applyMaterial/index.vue'
let activeName = ref(0)
let loading = ref(false)
type Props = {
	nowRowData?: any
}
let props = withDefaults(defineProps<Props>(), {
	nowRowData: {},
})
let tableData:any = ref({
})
// 通过id获取详情
const getInitData = async() =>{
	let res = await apiMod.view_nqtApplyInfo_view(props.nowRowData.id)
		if(res.code==0){
			tableData.value = res.data
			return Promise.resolve('ok')
		}else{
			return Promise.reject('no')
		}
} 
let processList:any = ref([{approvalRemarks:''}])
const getAduit = () =>{
	let params = {
		randomNo:props.nowRowData.applyId,
		fromId:props.nowRowData.id
	}	
	apiMod.view_approvalLogic_nqtProcess(params).then(res=>{
		if(res.code==0){
			processList.value = res.data
			loading.value = false
		}else{
			loading.value = false
		}
	})
}
//如果当前状态为待申请就提交改变状态为待审核
const changeApplyStatus = () =>{
	// getAduit()
	loading.value = true
	if(props.nowRowData.applyStatus==0){
		let params = {
		id:props.nowRowData.id,
		itemId:props.nowRowData.itemId,
		applyId:props.nowRowData.applyId,
		flag:1
		// applyStatus:1 // 待审批
		}
		apiMod.view_nqtApplyInfo_apply(params).then(res=>{
			getInitData().then(()=>{
				getAduit()
			})
		})
	}else{
		getAduit()
	}
}
// 去审批
const toApproval = (flag) =>{
	let params = {
		id:tableData.value.id,
		itemId:tableData.value.itemId,
		applyId:tableData.value.applyId,
		flag:flag
		// applyStatus:1 // 待审批
		}
		apiMod.view_nqtApplyInfo_apply(params).then(res=>{
			if(res.code==0){
				if(flag==3){
					tableData.value.isFinish = 1
				}
				getAduit()
				ElMessage({
					type: 'success',
					message: '操作成功',
				})
			}
		})
}
getInitData()
changeApplyStatus()

// 打开取人弹窗
const openDialog = (type) => {
	ElMessageBox.confirm('是否确认通过？', '申请审批', {
		confirmButtonText: '确认',
		cancelButtonText: '取消',
		type: 'warning',
	})
		.then(() => {
			// 判断是哪种审批
			if(type==1){
				toApproval(2)
			}else if(type==2){
				toApproval(3)
			}
			
		})
		.catch(() => {
			ElMessage({
				type: 'info',
				message: '操作成功',
			})
		})
}
</script>
<style scoped lang="scss">
.left_right {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	min-height: 40vh;
}
.left_part {
	width: calc(100% - 20% - 50px);
}
.right_part {
    margin-left: 50px;
	width: 20%;
}
.aduit_btn_part{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
</style>
